<template>
  <el-container>
    <el-header>Header</el-header>
    <el-main>
      <el-form :model="form">
        <el-row>
          <el-col :span="8" :offset="8">
            <div id="loginBox">
              用户登录<br />

              账号：<el-input v-model="form.username" placeholder="账号"></el-input><br />
              密码：<el-input v-model="form.password" type="password" placeholder="密码"
                @keyup.enter="onSubmit"></el-input><br />
              <router-link to="/forgetps" style="margin-left: 20px;">忘记密码</router-link>
              <router-link to="/regist" style="margin-left: 20px;">注册新用户</router-link>

              <!-- 管理员登录 <el-switch v-model="form.isadmin" /> -->

              <br />
              <el-button type="primary">重置</el-button>

              <el-button type="primary" @click="onSubmit()">登录</el-button>

            </div>
          </el-col>
        </el-row>
      </el-form>
    </el-main>

  </el-container>
</template>

<script>

import axios from "axios";
import m from '../test.js'
import { myAxiosGet, myAxiosPost } from '../axios/index.js'
import myAxios from '../axios'
import { ElMessage } from 'element-plus'
export default {
  data() {
    return {
      form: {
        username: "",
        password: "",
      },
    };
  },

  mounted() {
    console.log("11")
    // myAxios(
    //   {
    //     url: '/message/getMessageByUid1',
    //     //注意get传值是params
    //     params: { uid: 4 },
    //     method: "get"
    //   }).then(res => {
    //     if (res.code == 200) {
          
    //     } else if (res.code == -9) {
        
    //     }
    //   }).catch(error => {
    //     if (error.code == 'ERR_NETWORK') {
         
    //       this.$router.push("/404");
    //     }
    //   })


  },

  methods: {

    regist() {
      this.$router.push("/regist");
    },
    onSubmit() {
      myAxios(
        {
          url: '/user/login',
          //注意post传值是data
          data: this.form,
          method: "post"
        })
        //    myAxiosPost("/user/login", this.form)
        .then((res) => {
          console.log(res)
          if (res.code == 200) {
            var login = res.result;
            ElMessage.success(login.username + " " + res.msg)
            sessionStorage.setItem('user', JSON.stringify(login))
            this.$router.push("/main");
          } else {
            sessionStorage.removeItem('user')
            ElMessage.error(res.data.msg)
          }
        }).catch(err => {

        })

      // axios
      //   .post("/user/login",
      //     this.form
      //   )
      //   .then((res) => {
      //     if (res.data.code == 200) {
      //       var login = res.data.result;
      //       ElMessage.success(login.username + " " + res.data.msg)
      //       sessionStorage.setItem('user', JSON.stringify(login))
      //       this.$router.push("/main");
      //     } else {
      //       sessionStorage.removeItem('user')
      //       ElMessage.error(res.data.msg)
      //     }
      //   });
    },
  },
};
</script>
<style scoped>
/*整体样式*/
/* 
* {
  margin: 0;

  padding: 0;
} */

/*放账号密码input的div*/

#loginBox {
  background-color: #eee;
  font-family: "Courier New";
  color: grey;
  border-radius: 15px;
  margin-top: 100px;
}

/*布局容器样式 main header fotter*/



.el-main {
  background-image: url("../assets/background.webp");
  color: #333;
  text-align: center;
  line-height: 60px;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: auto;
}

body>.el-container {
  margin-bottom: 40px;
}


/*    输入框样式*/

.el-input {
  width: 50%;
}
</style>
